Set up the Template for New Image Choice

The image picker allows the end user to choose between the default image or upload/pick a new one from its library.

To configure the template, you will need to edit the .html file (see Update the HTML File) and .json file (see Update the params.json File).

Note: The end user is only able to choose or pick a new image if the following parameter is present and set to true for the given image field "allowNewImage": true.

HTML File

The HTML file must have a div class that will contain the image offered to the end user:

Copy
<div class="imageContainer">
    <img data-publish-id="image" class="image" src="./img/image1.jpg" alt="main image" />
</div>

JSON File

The params.json file must have a corresponding section that allows the end user to choose between the default image or upload/pick a new one from its library:

Copy
{    
    "id": "image",
    "label": "image",
    "default": "./img/image1.jpg",
    "type": "image",
    "allowNewImage": true,
    "allowFreeRatio": false,
    "aspectRatio": "16:19"
}